<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList1" @findClicked="findData" @Launchform="Launchform" />
    <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList2" @findClicked="findData" @Launchform="Launchform1" />

    <el-card style="margin-top: 10px" shadow="always" :body-style="{ padding: '5px' }">
      <div style="display: flex">
        <div style="width: 48%">
          <h1>{{ $t(`Print.SewingInstructionFeedDetails`) }}</h1>
          <Table
            :isLoading="isLoading"
            @inputChange="confirmChange"
            @selectValChange="selectValChange"
            @currentRow="currentRowList"
            class="table1"
            :tableHeader="tableHeader"
            :tableData="NeedleCarInstructionFillDetailQueryMethodsParmsTableDateList"
            :TableHeight="100"
            :outTableHeight="60"
          />
        </div>
        <div style="width: 50%; margin-left: 20px">
          <h1>{{ $t(`Print.SewingMachineReplenishmentProductionInquiry`) }}</h1>
          <Table
            :isLoading="isLoading1"
            :tableHeader="tableHeader1"
            :tableData="NeedleRepairSystemDetailsQueryMehtodsTableDateList.dtos"
            :TableHeight="100"
            :outTableHeight="60"
          />
          <PageModule
            :PageData="{ total, buttonS: true, pageSizeShow: true }"
            @pageSizeChange="handleSizeChangeTk"
            @pageChange="handleCurrentChangeTk"
          />
        </div>
      </div>
    </el-card>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import { ElMessage } from 'element-plus'
import { ElMessageBox } from 'element-plus'
import LoginWork from '@/utils/LoginWork'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'DeliveryNeedleCarReplenishmentDocuments'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ref, onMounted } from 'vue'
import {
  TreasurySinglePosition1,
  NeedleRepairSystemDetailsQuery,
  NeedleCarInstructionFillDetailQuery,
  NeedleFillingDetailDeleted,
  NeedleFillingDetailsAdded,
  NeedleRepairSystemDetailsQuery1
} from '@/api/WarehouseDepartment/FactoryStorage/DeliveryNeedleCarReplenishmentDocuments'
import type {
  NeedleRepairSystemDetailsQueryParms,
  NeedleRepairSystemDetailsQueryInterface,
  NeedleFillingDetailDeletedParms
} from '@/api/WarehouseDepartment/FactoryStorage/DeliveryNeedleCarReplenishmentDocuments'
const isLoading = ref(false)

const isLoading1 = ref(false)

const formList1 = ref([
  {
    type: 'selectJ',
    selectValue: '',
    selectP: '补单号',
    selectLabel: '',
    selectOptions: [],
    selectV2Width: '350px'
  },
  {
    type: 'input',
    inputPlaceholder: '指令号',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '型体',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '颜色',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '补单数量',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '已缴数量',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '删除针车补料明细当前行数据'
  },
  {
    type: 'button',
    checkboxLabel: '新增针车指令补料明细'
  },
  {
    type: 'button',
    checkboxLabel: '查询'
  }
])

const formList2 = ref([
  {
    type: 'date',
    dateLabel: '日期',
    dateValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '缴库单位',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入型体',
    inputValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
])

const formatCurrentDate = (date?: any) => {
  const year = date.getFullYear()
  const month = date.getMonth() + 1
  const day = date.getDate()
  return `${year}-${month}-${day}`
}

const currentDate = ref(new Date())

const slipDate = formatCurrentDate(currentDate.value)
const NeedleFillingDetailDeletedMethodsParms1 = ref<NeedleFillingDetailDeletedParms>({
  deptName: '',

  deptNo: '',
  lotNo: '',
  qty: '',
  remark: '',
  slipDate: '',
  slipNo: ''
})
const findData = (count: any) => {
  if (count === '置空') {
    clearFormList()
  }
  if (count === '查询') {
    if (NeedleCarInstructionFillDetailQueryMethodsParms.value === '') {
      JMessage.warning('指令号为空不可查询')
    } else {
      NeedleCarInstructionFillDetailQueryMethods()
    }
  }
  if (count === '删除针车补料明细当前行数据') {
    if (NeedleFillingDetailDeletedMethodsParms.value.slipNo === '') {
      JMessage.warning('请选择需要删除的数据')
    } else {
      handleCloseMateriaLKlc()
    }
  }
  if (count === '新增针车指令补料明细') {
      NeedleCarInstructionFillDetailQueryMethodsParmsTableDateList.value.push(TreasurySinglePositionMethodsTableDateList.value)
    
  }
}

const clearFormList = () => {
  formList2.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    }
    if (item.type === 'select') {
      item.selectValue = ''
    }
    if (item.type === 'date') {
      item.dateValue = ''
    }
  })
  formList1.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    }
    if (item.type === 'selectJ') {
      item.selectValue = ''
    }
  })
  NeedleRepairSystemDetailsQueryMehtods()
}

// 针车修改
const newObject = ref({
  lotNo: '',
  slipNo: '',
  deptName: '',
  deptNo: '',
  qty: '',
  remark: '',
  slipDate: '',
})

const confirmChange = async (row?: any) => {
  console.log(row)
  if(row.deptName.select1){
const valueParts = row.deptName.select1[0].value.split(' '); // Split once
row.deptNo = valueParts[0]; // The first part is a number (deptNo).
row.deptName = valueParts[1]; // The second part is a name (deptName).
  }else{
    row.deptName = row.deptName.selectValue
  }
  
  const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/stcSupUpdate`, row)
  if (result.code === 200) {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.success(result.message)
  } else {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.error(result.message)
  }
}

// 针车指令明细新增
const selectValChange = async(row: any) => {
  console.log(row)
  if(row.id){
    const valueParts = row.deptName.selectValue.split(' '); // Split once
  row.deptNo = valueParts[0]; // The first part is a number (deptNo).
  row.deptName = valueParts[1]; // The second part is a name (deptName).
  const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/stcSupUpdate`, row)
  if (result.code === 200) {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.success(result.message)
  } else {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.error(result.message)
  }
  }else{
 NeedleFillingDetailDeletedMethodsParms1.value.slipNo = row.slipNo
  // NeedleFillingDetailDeletedMethodsParms1.value.lotNo = NeedleCarInstructionFillDetailQueryMethodsParms.value
    const valueParts = row.deptName.selectValue.split(' '); // Split once
  NeedleFillingDetailDeletedMethodsParms1.value.deptNo = valueParts[0]; // The first part is a number (deptNo).
  NeedleFillingDetailDeletedMethodsParms1.value.deptName = valueParts[1]; // The second part is a name (deptName).

   const result = await LoginWork.put<any, any>(`/pcFactorStockQuery/stcSupAdd`, NeedleFillingDetailDeletedMethodsParms1.value)
  if (result.code === 200) {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.success(result.message)
  } else {
    NeedleCarInstructionFillDetailQueryMethods()
    JMessage.error(result.message)
  }
  }
 
}

// const NeedleFillingDetailsAddedMethdos = async () => {
//   const result = await NeedleFillingDetailsAdded(NeedleFillingDetailDeletedMethodsParms1.value)
//   if (result.code === 200) {
//     NeedleCarInstructionFillDetailQueryMethods()
//     JMessage.success(result.message)
//   } else {
//     NeedleCarInstructionFillDetailQueryMethods()
//     JMessage.error(result.message)
//   }
// }

// 针车指令补料明细删除
const NeedleFillingDetailDeletedMethodsParms = ref<NeedleFillingDetailDeletedParms>({
  id:''
})

const currentRowList = (row: any) => {
  const { slipNo, style, color, surplusQty, qty, deptName, remark, slipDate,deptNo } = row
  NeedleFillingDetailDeletedMethodsParms.value.id = row.id
  formList1.value[2].inputValue = style
  formList1.value[3].inputValue = color
  formList1.value[4].inputValue = surplusQty
  formList1.value[5].inputValue = qty
  if (deptName.select1 !== undefined) {
    newObject.value.deptName = deptName.select1[0].value.split(' ')[1]
    newObject.value.deptNo = deptName.select1[0].value.split(' ')[0]
  }
  newObject.value.qty = qty
  newObject.value.remark = remark
  newObject.value.slipDate = slipDate
  console.log(newObject.value)
}

const NeedleFillingDetailDeletedMethods = async () => {
    const result = await NeedleFillingDetailDeleted(NeedleFillingDetailDeletedMethodsParms.value)
    if (result.code === 200) {
      NeedleCarInstructionFillDetailQueryMethods()
      JMessage.success(result.message)
    } else {
      NeedleCarInstructionFillDetailQueryMethods()
      JMessage.error(result.message)
    }
}

const handleCloseMateriaLKlc = (_done?: () => void) => {
  ElMessageBox.confirm('确认要删除数据吗?')
    .then(async () => {
      NeedleFillingDetailDeletedMethods()
    })
    .catch(() => {})
}

// 针车指令补料明细查询
const NeedleCarInstructionFillDetailQueryMethodsParms = ref('')

const NeedleCarInstructionFillDetailQueryMethodsParmsTableDateList = ref<any>([])

const NeedleCarInstructionFillDetailQueryMethods = async () => {
  isLoading.value = true
  const result = await NeedleCarInstructionFillDetailQuery(NeedleCarInstructionFillDetailQueryMethodsParms.value)
  NeedleCarInstructionFillDetailQueryMethodsParmsTableDateList.value = result.map((item: any) => {
    item.disableConfirm = true
    if (item.slipDate === slipDate) {
      item.change = 'Y'
      item.deptName = {
        selectValue: item.deptName,
        options: TreasurySinglePositionMethodsTableDateList.value.deptName.options.map((item: any) => {
          return item
        }),
        select1: TreasurySinglePositionMethodsTableDateList.value.deptName.options.filter((item1: any) => {
          return item1.label.split(' ')[1] === item.deptName
        })
      }
    } else {
      item.deptName = {
        selectValue: item.deptName,
        options: []
      }
    }
    return item
  })
  if (result.length > 0) {
    formList1.value[2].inputValue = result[0].style
    formList1.value[3].inputValue = result[0].color
    formList1.value[4].inputValue = result[0].surplusQty
    formList1.value[5].inputValue = result[0].qty
  }
  isLoading.value = false
}

// 缴库单位获取
const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      optionKey: index,
      optionValue: item,
      optionLabel: item
    }
  })
}

const TreasurySinglePositionMethodsTableDateList = ref({
  deptName: { selectValue: '', options: [] },
  slipDate: slipDate,
  qty: '',
  remark: '',
  slipNo: '',
  change: true,
  disableConfirm: true
})

const EvaluatesTheArrayReturnValue1 = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      value: item,
      label: item
    }
  })
}

const TreasurySinglePositionMethods = async () => {
  let NewArray = []
  const result = await TreasurySinglePosition1()
  NewArray = result.reduce((arr: any, item: any) => {
    if (item.deptNo && item.deptName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.deptNo + ' ' + item.deptName)
    }
    return arr
  }, [])
  formList2.value[1].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  TreasurySinglePositionMethodsTableDateList.value.deptName.options = EvaluatesTheArrayReturnValue1(NewArray)
  TreasurySinglePositionMethodsTableDateList.value.deptName.options.unshift({
    value: '',
    label: ''
  })
}

// 针车补制查询
const NeedleRepairSystemDetailsQueryMehtodsParms = ref<NeedleRepairSystemDetailsQueryParms>({
  deptNo: '',
  lotNo: '',
  pageNum: 1,
  pageSize: 40,
  slipDateEnd: '',
  slipDateStart: '',
  slipNo: '',
  style: ''
})

const NeedleRepairSystemDetailsQueryMehtodsTableDateList = ref<NeedleRepairSystemDetailsQueryInterface>({
  dtos: []
})

const Launchform = (row: any) => {
  let list = row[0].selectValue.split(' ')
  if (list.length > 1) {
    formList1.value[0].selectValue = list[0]
    formList1.value[1].inputValue = list[1]
    TreasurySinglePositionMethodsTableDateList.value.slipNo = formList1.value[0].selectValue as string
    NeedleCarInstructionFillDetailQueryMethodsParms.value = formList1.value[1].inputValue as string
    NeedleFillingDetailDeletedMethodsParms1.value.lotNo = formList1.value[1].inputValue as string
  }
}

const Launchform1 = (row: any) => {
  NeedleRepairSystemDetailsQueryMehtodsParms.value.slipDateStart = row[0].dateValue[0]
  NeedleRepairSystemDetailsQueryMehtodsParms.value.slipDateEnd = row[0].dateValue[1]
  NeedleRepairSystemDetailsQueryMehtodsParms.value.deptNo = row[1].selectValue.split(' ')[0]
  NeedleRepairSystemDetailsQueryMehtodsParms.value.lotNo = row[2].inputValue
  NeedleRepairSystemDetailsQueryMehtodsParms.value.style = row[3].inputValue
  NeedleRepairSystemDetailsQueryMehtods()
}

const NeedleRepairSystemDetailsQueryMehtods = async () => {
  isLoading1.value = true
  const result = await NeedleRepairSystemDetailsQuery1(NeedleRepairSystemDetailsQueryMehtodsParms.value)

  NeedleRepairSystemDetailsQueryMehtodsTableDateList.value.dtos = result.dtos
  // formList1.value[0].selectOptions = result.dtos.map((item: any, index: number) => {
  //   return {
  //     optionKey: index,
  //     value: `${item.slipNo} ${item.lotNo} ${item.deptName}`,
  //     label: `${item.slipNo} ${item.lotNo} ${item.deptName}`
  //   }
  // }) as any
  total.value = result.total!
  isLoading1.value = false
}

const NeedleRepairSystemDetailsQueryMehtods1 = async () => {
  isLoading1.value = true
  const result = await NeedleRepairSystemDetailsQuery(NeedleRepairSystemDetailsQueryMehtodsParms.value)
  formList1.value[0].selectOptions = result.map((item: any, index: number) => {
    return {
      optionKey: index,
      value: `${item.slipNo} ${item.lotNo} ${item.deptName}`,
      label: `${item.slipNo} ${item.lotNo} ${item.deptName}`
    }
  }) as any
}

const total = ref(0)

const handleSizeChangeTk = (val: number) => {
  NeedleRepairSystemDetailsQueryMehtodsParms.value.pageSize = val
  NeedleRepairSystemDetailsQueryMehtods()
}

const handleCurrentChangeTk = (val: number) => {
  NeedleRepairSystemDetailsQueryMehtodsParms.value.pageNum = val
  NeedleRepairSystemDetailsQueryMehtods()
}

onMounted(() => {
  TreasurySinglePositionMethods()

  NeedleRepairSystemDetailsQueryMehtods()

  NeedleRepairSystemDetailsQueryMehtods()

  NeedleRepairSystemDetailsQueryMehtods1()
})

// 表格数据
const tableHeader = ref([
  {
    label: '缴库单位',
    prop: 'deptName',
    type: 'select'
  },
  {
    label: '日期',
    prop: 'slipDate',
    type:'dateSingle'
  },
  {
    label: '数量',
    prop: 'qty'
  },
  {
    label: '备注',
    prop: 'remark'
  },
  {
    label: '补单号',
    prop: 'slipNo',
    change: true
  }
])

const tableHeader1 = ref([
  {
    label: '缴库单位',
    prop: 'deptName'
  },
  {
    label: '日期',
    prop: 'slipDate'
  },
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '数量',
    prop: 'qty'
  },
  {
    label: '备注',
    prop: 'remark'
  },
  {
    label: '补单号',
    prop: 'slipNo'
  }
])
</script>

<style lang="less" scoped>
h1 {
  font-size: 16px;
  color: red;
}

.table1 {
  :deep(th:nth-child(3)) {
    color: #0000ff !important;
  }

  :deep(th:nth-child(4)) {
    color: #0000ff !important;
  }
}
</style>
